<template>
  <div class="dialog">
      <el-dialog :title="nowChanceStau === 'pass'?'通过确认':'不通过原因'" :visible.sync="showDialog" width="25%" top="0" :close-on-click-modal="false" @close="cancel">
          <el-form ref="ruleForm" v-if="nowChanceStau === 'unpass'" label-position="left" :model="formData" :rules="rules" class="el-form">
              <el-form-item label="不通过原因: " prop="failReason" class="w100p">
                  <el-input type="textarea" :disabled="dialogParams.auditType!=='REVIEW'" :rows="3" placeholder="请输入内容" v-model="formData.failReason">
                  </el-input>
              </el-form-item>
          </el-form>
          <div v-else class="font-cls"><span>确定通过审核吗?</span></div>
          <div slot="footer" class="dialog-footer">
              <el-button class="cancelbtn" @click="cancel()">取 消</el-button>
              <el-button type="primary" v-if="dialogParams.auditType==='REVIEW'" class="savebtn" @click="save('ruleForm')">{{nowChanceStau=='unpass'?"保 存":"确 定"}}</el-button>
          </div>
      </el-dialog>
  </div>
</template>

<script>
export default {
  name: "",
  components: {},
  props: {
      nowChanceStau: {
          type: String,
          default: "",
      },
      show: {
          type: Boolean,
          default: false,
      },
      dialogParams: {
          type: Object,
          default: () => {
              return {};
          },
      },
  },
  data() {
      return {
          rules: {
              failReason: [
                  {
                      required: true,
                      message: "请输入未通过原因",
                      trigger: ["change", "blur"],
                  },
              ],
          },
          showDialog: this.show,
          formData: {
            failReason:''
          },
      };
  },
  watch: {
      show(v) {
          this.showDialog = v;
          this.resetFields();
      },
      "dialogParams.failReason": {
          handler(v) {
              this.formData.failReason = v;
              if (this.dialogParams.auditType !== "REVIEW" && !v) {
                  this.formData.failReason = "暂无原因！";
              }
          },
          deep: true,
      },
  },
  methods: {
      save(formData) {
          if (this.nowChanceStau == "pass") {
              this.submitAudite();
          } else {
              this.$refs[formData].validate((valid) => {
                  if (valid) {
                      this.submitAudite();
                  } else {
                      return false;
                  }
              });
          }
      },
      submitAudite() {
          this.$emit("submitAudite", {
              failReason: this.formData.failReason,
          });
      },
      cancel() {
          this.$emit("cancelDialog");
      },
      resetFields() {
          this.$refs["ruleForm"] && this.$refs["ruleForm"].resetFields();
      },
  },
};
</script>

<style lang="scss" scoped>
.font-cls {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  font-size: 20px;
}
</style>
